<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:prop="clr-namespace:SkinningSample.Properties"
                    xmlns:local="clr-namespace:SkinningSample">

  <!--=========================================================================================-->
  <!-- Simple rectangular button style. -->
  <Style x:Key="PlainButtonStyle" TargetType="{x:Type Button}">
    <Setter Property="Background" Value="{DynamicResource ButtonBrush}"/>
    <Setter Property="BorderBrush" Value="{DynamicResource PlainButtonBorderBrush}"/>
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Padding" Value="6,3,6,6"/>
    <Setter Property="FontSize" Value="12"/>
    <Setter Property="FontWeight" Value="Bold"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
          <Grid>
            <!-- Transparent surface to give the button a full rectangular hit area. -->
            <Rectangle Fill="Transparent"/>

            <!-- This border gives the button it's primary appearance. -->
            <Border x:Name="Border" BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    Background="{TemplateBinding Background}"
                    Margin="8" CornerRadius="5">
              <Grid>
                <!-- Used to display a residual highlight after a press. -->
                <Border x:Name="Highlight" CornerRadius="5" Opacity="0"
                        Background="{DynamicResource ActiveSelectionHighlight}"
                        HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
                <ContentPresenter
                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                    Margin="{TemplateBinding Padding}" RecognizesAccessKey="True"
                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
              </Grid>
            </Border>
          </Grid>
          <ControlTemplate.Triggers>
            <Trigger Property="IsEnabled" Value="false">
              <Setter Property="Foreground" Value="DarkGray"/>
            </Trigger>
            <Trigger Property="IsPressed" Value="true">
              <Setter TargetName="Border" Property="Background" Value="{DynamicResource ActiveSelectionHighlight}" />
              <Trigger.ExitActions>
                <BeginStoryboard>
                  <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="Highlight" Storyboard.TargetProperty="Opacity"
                                     From="100" To="0" Duration="0:0:0.5" FillBehavior="Stop"/>
                  </Storyboard>
                </BeginStoryboard>
              </Trigger.ExitActions>
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!--==========================================================================================-->
  <!-- A simple button with no frame - it just appears as content over the background. It provides
  a selection highlight when the button is pressed. The default foreground is white as this style
  assumes a dark background. -->
  <Style x:Key="NakedButtonStyle" TargetType="{x:Type Button}">
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Padding" Value="5"/>
    <Setter Property="FontSize" Value="12"/>
    <Setter Property="FontWeight" Value="Bold"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
          <Grid>
            <!-- Used to implement button highlighting. It also ensures the full button area is
            used for hit testing. -->
            <Rectangle x:Name="Highlight" Fill="{DynamicResource ActiveSelectionHighlight}" Opacity="0"/>
            
            <ContentPresenter
                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                Margin="{TemplateBinding Padding}" RecognizesAccessKey="True"
                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
          </Grid>
          <ControlTemplate.Triggers>
            <Trigger Property="IsEnabled" Value="false">
              <Setter Property="Foreground" Value="DarkGray"/>
            </Trigger>
            <Trigger Property="IsPressed" Value="True">
              <Setter TargetName="Highlight" Property="Opacity" Value="100" />
              <Trigger.ExitActions>
                <BeginStoryboard>
                  <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="Highlight" Storyboard.TargetProperty="Opacity"
                                     From="100" To="0" Duration="0:0:0.5" FillBehavior="Stop" />
                  </Storyboard>
                </BeginStoryboard>
              </Trigger.ExitActions>
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!--==========================================================================================-->
  <!-- A naked button style designed for use as the root element in list box items. -->
  <Style x:Key="ListItemDisplayButtonStyle" TargetType="{x:Type Button}">
    <Setter Property="Foreground" Value="Black"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Padding" Value="5"/>
    <Setter Property="FontSize" Value="12"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
          <Grid>
            <!-- Used to implement button highlighting. It also ensures the full button area is
            used for hit testing. -->
            <Rectangle x:Name="Highlight" Fill="{DynamicResource ActiveSelectionHighlight}" Opacity="0"/>
            <ContentPresenter
                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                Margin="{TemplateBinding Padding}" RecognizesAccessKey="True"
                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
          </Grid>
          <ControlTemplate.Triggers>
            <Trigger Property="IsEnabled" Value="false">
              <Setter Property="Foreground" Value="DarkGray"/>
              <Setter TargetName="Highlight" Property="Opacity" Value="100"/>
              <Setter TargetName="Highlight" Property="Fill" Value="LightGray"/>
            </Trigger>
            <Trigger Property="IsPressed" Value="True">
              <Setter TargetName="Highlight" Property="Opacity" Value="100" />
              <Trigger.ExitActions>
                <BeginStoryboard>
                  <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="Highlight" Storyboard.TargetProperty="Opacity"
                                     From="100" To="0" Duration="0:0:0.5" FillBehavior="Stop" />
                  </Storyboard>
                </BeginStoryboard>
              </Trigger.ExitActions>
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>  
  
  <!--==========================================================================================-->
  <!-- Style for a back button used at the top left of the toolbar. -->
  <Style x:Key="BackButtonStyle" TargetType="{x:Type Button}">
    <Setter Property="Background" Value="{DynamicResource ButtonBrush}"/>
    <Setter Property="BorderBrush" Value="{DynamicResource PlainButtonBorderBrush}"/>
    <Setter Property="SnapsToDevicePixels" Value="True"/>
    <Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="FontWeight" Value="Bold"/>
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="FontSize" Value="12"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
          <Grid>
            <!-- Transparent surface to give the button a full rectangular hit area. -->
            <Rectangle Fill="Transparent"/>

            <!-- This grid provides a constant outer margin around the button graphics. -->
            <Grid Margin="3,8,5,8">
              <Grid.ColumnDefinitions>
                <ColumnDefinition Width="15"/>
                <ColumnDefinition Width="*"/>
              </Grid.ColumnDefinitions>

              <!-- Use a Border around the content presenter to provide the background colour
              and the thin border. We use a negative left margin to get the border underlaid
              under the left arrow so the left edge of our thin border is covered up. -->
              <Border x:Name="Border" Background="{TemplateBinding Background}" Grid.Column="1"
                      BorderBrush="{TemplateBinding BorderBrush}"
                      BorderThickness="1"
                      Margin="-7,0,0,0" CornerRadius="5">
                <!-- Inner grid to provide a margin that cancels out the negative margin of our
                parent Border. We don't apply the margin directly on the presenter since it is
                used to implement the padding.-->
                <Grid Margin="7,0">
                  <ContentPresenter
                    Margin="{TemplateBinding Padding}" RecognizesAccessKey="True"
                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                </Grid>
              </Border>

              <!-- The left arrow portion of the back button. Drawn last to make it overlap the
              Border so it covers up the left-hand edge of the Border. -->
              <Path x:Name="Arrow" Grid.Column="0" Stroke="{TemplateBinding BorderBrush}" Stretch="Fill"
                    StrokeThickness="1" Fill="{TemplateBinding Background}"
                    Data="M 24,38 22,38 L 21,38 A 5,3 10 0 1 16,36 L 1,20, 16,4 A 5,3 -10 0 1 21,2 L 22,2 24,2"/>
            </Grid>
          </Grid>
          <ControlTemplate.Triggers>
            <Trigger Property="IsPressed" Value="true">
              <Setter TargetName="Border" Property="Background" Value="{DynamicResource ActiveSelectionHighlight}" />
              <Setter TargetName="Arrow" Property="Fill" Value="{DynamicResource ActiveSelectionHighlight}" />
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!--=========================================================================================-->
  <!-- Naked button style with no selection highlight. -->
  <Style x:Key="NakedButtonNoHighlightStyle" TargetType="{x:Type Button}">
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Padding" Value="5"/>
    <Setter Property="FontSize" Value="12"/>
    <Setter Property="FontWeight" Value="Bold"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
          <Grid>
            <!-- Transparent surface to give the button a full rectangular hit area. -->
            <Rectangle Fill="Transparent"/>
            <ContentPresenter
                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                Margin="{TemplateBinding Padding}" RecognizesAccessKey="True"
                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
          </Grid>
          <ControlTemplate.Triggers>
            <Trigger Property="IsEnabled" Value="false">
              <Setter Property="Foreground" Value="DarkGray"/>
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!--=========================================================================================-->
  <!-- Radio button style for toolbars. Shows selection with a background highlight. -->
  <Style x:Key="ToolbarRadioButtonStyle" TargetType="{x:Type RadioButton}">
    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type RadioButton}">
          <Grid>
            <Rectangle x:Name="Highlight" Fill="Transparent"/>
            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}"
                                RecognizesAccessKey="True" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
          </Grid>
          <ControlTemplate.Triggers>
            <Trigger Property="IsEnabled" Value="false">
              <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
            </Trigger>
            <Trigger Property="IsChecked" Value="true">
              <Setter TargetName="Highlight" Property="Fill" Value="{DynamicResource ActiveSelectionHighlight}"/>
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>


</ResourceDictionary>